Skip to main content

Basic Concepts

Install Tailwind CSS with Create React App​

https://tailwindcss.com/docs/guides/create-react-app

Some the relationship between tailwindcss and standard css​

// z代表z-index; 比如z-4: z-index: 4

// x代表水平；比如：px-2：padding-left: 2rem; padding-right: 2rem;

// y代表上下；比如: py-2：padding-top: 2rem; padding-bottom: 2rem;

// t代表上; 比如：pt-2: padding-top: 2rem;

// b达标下；比如：pb-2: padding-bottom:2rem;

// bg-gradient-to-b from-red-400 to-red-200 背景渐变

// flex-shrink-0 = flex-shrink : 0，就是当flex布局的时候，这一块不允许挤压

// fas fa-wind fa-2x 是一个图标，来自于font-awesome不是tailwind的内容，具体看font-awesome官网